import { Component } from '@angular/core';
import { NavController, NavParams } from 'ionic-angular';
import { PreviewPage } from './preview/preview';
import { SetSizePage } from './setSize/setSize';
import { Toast } from '@ionic-native/toast';

declare var $:any;

@Component({
  selector: 'page-clipboard',
  templateUrl: 'clipboard.html'
})
export class ClipBoardPage {
  // private w_choosed :any
  // private h_choosed :any
  // private isShowSize :any
  private albumName: any
  private img: any
  constructor(public navCtrl: NavController,
              public navParams: NavParams,
              private toast: Toast) {
    
  }

  ionViewDidEnter(){
    this.setPicture()
  }



  setPicture(){
    var image =$("#bg-pic")[0];
    image.src = this.navParams.data.pic;
    this.img = $("#bg-pic");
    this.img.cropper('setData',{x:100, y:100, width:100, height:100});
   
  }

  onShowPreview() {
    setTimeout(() => {
      var result = this.img.cropper('getCroppedCanvas',{
        fillColor:"#fff",
        maxHeight:4096,
        maxWidth:4096});
      var getData = this.img.cropper('getData',true)
      console.log(result);
      console.log('getData');
      console.log(getData);
      if(this.albumName == undefined) {
        this.toast.show('请填写图集名。','3000','center').subscribe();
      }else{
        if(getData.width == 0 || getData.height == 0){
          this.toast.show('请截取的高宽都要大于0。','3000','center').subscribe();
        }else{
          this.navCtrl.push(PreviewPage,
            { 'result':result,
              // 'getData':getData,
              'database':this.navParams.data.database,
              'albumname': this.albumName }
          )
        }
      }
      
      
      
    }, 100);
  }

  onShowSetSize() {
    if(this.albumName != undefined) {
      this.navCtrl.push(SetSizePage,
        { 'albumname': this.albumName,
          'pic': this.navParams.data.pic,
          'database':this.navParams.data.database,});
    }else {
      this.toast.show('请填写图集名。','3000','center').subscribe();
    }
  }

  /**
   * 返回
   * 
   * @memberof ClipBoardPage
   */
  goback() {
    this.navCtrl.pop()
  }

  
  // onShowSize() {
  //   this.isShowSize = true;

  // }
  
  // onGetSizeW(w) {
  //   this.isShowSize = false;
  //   this.w_choosed = w;
  //   console.log(w)
  // }

  // onGetSizeH(h) {
  //   this.isShowSize = false;
  //   this.h_choosed = h;
  //   console.log(h)
  // }

  getTitle(title) {
    this.albumName = title;
  }

  goTestPreview(){
    this.navCtrl.push(PreviewPage)
  }
  goTestSetsize(){
    this.navCtrl.push(SetSizePage)
  }
}
